#logo{width: 100%;height: 200px;}
.logo_img{height: 100px;width: 100px; position: relative;  top:60px;left: 38%}

#useraccount,#userpwd{position: relative;}
.user-ico,.pwd-ico{position: absolute;left: 20px;top: 30px; background: url(../img/login.png) no-repeat;background-position: 0px 0px;z-index: 5;
width: 30px;height: 30px;background-size: 30px 30px;}
.pwd-ico{background: url(../img/pwd.png) no-repeat;background-size: 30px 30px;}

#denglu{width: 70%;height: 50px;background: #ffcc33;position: absolute;left: 10%;border-radius: 30px;font-size: 18px;
padding:0;border: none;letter-spacing: 20px;}
#denglu:focus{outline: none;background: #ffcc00;}

#forgetpwd,#join{position: relative;top: 100px;left: 42%;color: gray;font-size: 16px;text-decoration: none;}
#join{top: 130px;left: 10%;}
#forgetpwd:active,#join:active{color: #ffcc00;}

@media  screen and (min-width: 320px)and (max-width:768px){
input{margin: 20px 4%;height: 50px;background: rgba(0,0,0,0.7);border-radius: 10px;padding-left: 40px;color: white;}
.user-ico,.pwd-ico{top: 30px;}
#forgetpwd,#join{position: relative;top: 80px;left: 35%;color: gray;font-size: 16px;text-decoration: none;}
#join{top: 110px;left:1%;}
#forgetpwd:active,#join:active{color: #ffcc00;}
}

@media only screen and (min-width: 768px)and (max-width:1024px) {
	input{margin: 50px 7%;height: 70px;background: rgba(0,0,0,0.7);border-radius: 10px;padding-left: 60px;color: white;
	font-size: 18px;}
.user-ico,.pwd-ico{top: 70px;left: 70px;}
#denglu{height: 70px;}
#forgetpwd,#join{position: relative;top: 150px;left: 45%;color: gray;font-size: 19px;text-decoration: none;}
#join{top: 180px;left:25%;}
#forgetpwd:active,#join:active{color: #ffcc00;}
}

@media only screen and (min-width: 1024px){
	input{margin: 50px 7%;height: 70px;background: rgba(0,0,0,0.7);border-radius: 10px;padding-left: 60px;color: white;
	font-size: 18px;}
.user-ico,.pwd-ico{top: 70px;left: 90px;}
#denglu{height: 70px;font-size: 24px;letter-spacing: 50px;}
#forgetpwd{position: relative;top: 150px;left: 46%;color: gray;font-size: 21px;text-decoration: none;display:block;color: #a8a8a8;}
#join{position: relative;top: 160px;left: 40%;color: gray;font-size: 21px;text-decoration: none;display:block;
top: 180px;left:40%;color: #a8a8a8;}
#forgetpwd:active,#join:active{color: #ffcc00;}
}
